*, :after, :before { --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scroll-snap-strictness: proximity; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59, 130, 246, .5); --tw-ring-offset-shadow: 0 0 transparent; --tw-ring-shadow: 0 0 transparent; --tw-shadow: 0 0 transparent; --tw-shadow-colored: 0 0 transparent; }
*, :after, :before { border: 0 solid #e5e7eb; box-sizing: border-box; }
html,body{overflow-x:hidden;-webkit-overflow-scrolling: touch;margin: 0;padding: 0;}
img { overflow-clip-margin: content-box; overflow: clip; }
#MainContent{background-color:#0e0e0e; color:#ffffff;position: relative;}
.container-fluid { --offset-x: 1rem; margin-left: auto; margin-right: auto; max-width: calc(var(--fluid-container-width, 1620px) + var(--offset-x)* 2); padding-left: var(--offset-x); padding-right: var(--offset-x); width: 100%;}
.container-fluid{max-width:1440px; padding-left:2rem; padding-right:2rem;}

.product-display-section {padding-top: 40px;}

/* 落地页 banner部分 */
.header-banner {width: 100%; /*max-width:1920px;*/  background-size: cover;  background-position: center;  max-height: 900px; /* 设置适合的高度 */  display: flex;  align-items: center;  color: #fff; margin: 0 auto;position: relative;}
.header-banner .banner {  position: absolute;  top:50%;  width: 80%;  /*max-width: 1200px;*/width: 100%;  background: linear-gradient(135deg, #0e0e0e 60%, #3a3a3a 100%);  padding: 0 80px;  border-radius: 8px;  overflow: hidden;}

.banner-content {  max-width: 500px;  width: 100%;  padding: 0 80px;}
.banner-title {  font-size: 2rem;  color: orange;  margin-bottom: 10px;}
.banner-subtitle {  font-size: 3rem;  font-weight: bold;  color: #ffa500;  margin-bottom: 20px;}
.banner-text {  font-size: 1.2rem;  margin-bottom: 30px;}
.banner-dates {  font-size: 0.9rem;  color: #aaa;  margin-bottom: 30px;  display: flex;  align-items: center;  gap: 10px;}
.countdown {  font-size: 1.2rem;  color: #ffcc00;}
.banner-dates img {  margin-right: 5px;display: inline;}
.banner-button {  padding: 10px 20px;  background-color: #007bff;  color: #fff;  border: none;  border-radius: 4px;  cursor: pointer;  text-decoration: none;}
.banner-mobile-image { display: none; width: 100%; }
.banner-desktop-image { display: block; width: 100%; }

.banner-dates {position: absolute;left:0; top:0; display: block;  width: 100%; background-color: #ad1a30;color:#fff;}
.banner-dates .time-countdown-title {text-align: center; font-size: 24px;font-weight: 600;  margin-top: 30px; margin-bottom: 30px;}
.banner-dates .time-countdown-content .time-countdown-tb {width: 30%; margin: 10px auto;}
.time-countdown-day,.time-countdown-hour,.time-countdown-min,.time-countdown-sec {text-align: center;}
.time-countdown-day span,.time-countdown-hour span,.time-countdown-min span,.time-countdown-sec span {padding: 10px; font-size: 26px; font-weight: 400;background-color: #a1a1a1;border-radius: 10px;}
.banner-dates .time-countdown-content .time-countdown-tb tr td {text-align: center;}
.banner-dates .time-countdown-content .time-countdown-tb tr:last-child {line-height: 50px;}

/* Section styling */
.card-section { display: flex; justify-content: center; gap: 30px; padding: 20px; }
.card { max-width: 440px; max-height: 250px; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; text-align: center; }
.card a { position: relative; margin-bottom: 10px; padding: 12px; }
.card a img{border-radius: 12px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);}

/* 落地页中部导航栏样式 */
.navbar {  width: 100%;   background-color: #ad1a30; padding: 0px 20px;  position: relative;  z-index: 100;}
.navbar.fixed {  position: fixed;  top: 0;  left: 0;  width: 100%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);}
.navbar .navbar-wrap{display: flex;justify-content: space-between; max-width: 1440px; /*确保与商品列表的宽度一致 */margin: 0 auto; padding-left:2rem; padding-right:2rem;}
.navbar  .navbar-wrap a { color: #ffffff;  text-decoration: none;  padding: 20px 20px; font-size: 18px;line-height: 1.625rem; font-weight:500;font-family: 'HarmonyOS Sans';}
.navbar  .navbar-wrap a:hover{/*color: #ad1a30; border-bottom: 2px solid #ad1a30;*/font-weight:800; background-color: #555555;}
.navbar  .navbar-wrap a.active{/*color: #ad1a30; border-bottom: 2px solid #ad1a30;*/font-weight:800; background-color: #555555;}

/* 落地页商品列表部分 */
.product-display-section h2{padding: 0px; margin: 0px; color:#fff9d4;font-size:44px;text-align: center;vertical-align: middle;}
.product-display-section h2 .sec-custome-h2-img{ display:inline-block; }
.product-display-section .product-section {width: 100%; /*max-width: 1280px;*/ padding: 40px 0px;  display: flex; }

/* 落地页Special Sale部分 */
.special-sale-card {width: 100%; display: flex; gap: 0px;justify-content: center;flex-wrap: wrap;}
.special-sale-card-second{margin-top: 50px;}
.special-sale-card .product-content { background-color: #ffffff; position: relative; width: 70%;display: flex; gap: 0px;justify-content: center;flex-wrap: wrap;}
.special-sale-card .discount-tag {position: absolute; width:170px; top: 10px;left: 10px;background-image: url('special_diff_bg.png'); background-position: center center;background-repeat: no-repeat;background-size: cover; color: #fff;font-size: 14px;font-weight: bold;padding: 15px 40px 20px;}
.special-sale-card .product-img { width: 45%; padding: 40px; display: flex; justify-content: center; align-items: center;} 
.special-sale-card .product-img .product-image { max-width: 100%; }
.special-sale-card .product-details { width: 55%; text-align: left; color: #191919; padding-top: 30px;}
.special-sale-card .product-details .tip-label {color:#871525;display: block;margin-top: 20px;}
.special-sale-card .product-details .product-title { font-size: 18px;  font-weight: bold;  margin-bottom: 10px; color: #191919; margin-top: 10px;}
.special-sale-card .product-details .product-options { list-style-type: none; padding: 0; margin: 10px 0; font-size: 14px; margin: 5px 0; display: flex; flex-direction: column; }
.special-sale-card .product-details .product-options .label-item{margin:10px 5px;}
.special-sale-card .product-details .product-options .label-item span{padding: 3px 5px; border: 1px solid #666;}
.special-sale-card .product-details .product-options .label-item span:hover{cursor:pointer;background-color:#3a3a3a;color: #ffffff;}
.special-sale-card .product-details .product-options .label-item.active span{background-color:#3a3a3a;color: #ffffff;}
.special-sale-card .product-details .price {font-size: 1.5rem;color: #871525;font-weight: bold;margin-right: 10px;}
.special-sale-card .product-details .old-price {font-size: 1rem;color: #888;text-decoration: line-through; margin-left: 10px;}
.special-sale-card .product-details .product-buttons { display: flex; justify-content: center; gap: 30px; margin: 20px 0;}
.special-sale-card .product-details .product-buttons .buy-now, .special-sale-card .product-details .product-buttons .learn-more { background-color: #871525; color: #fff; border: none; padding:15px 50px; font-size: 18px; font-weight: 400; border-radius: 30px; cursor: pointer; }
.special-sale-card .product-details .product-buttons .learn-more { background-color: #e7e7e7;font-size: 18px;color:#3e3a39;}
.special-sale-card .product-details .product-buttons .buy-now:hover { background-color: #871525;}
.special-sale-card .product-details .product-buttons .learn-more:hover { background-color: #777;color:#fff;}
.special-sale-card .imgs-slider {width: 30%;text-align:justify;text-justify :distribute-all-lines;overflow: hidden;}

.special-sale-card .imgs-slider .swiper {width:100%;height: 100%;}
.special-sale-card .imgs-slider .swiper .imgs-slider-item {width:100%;height: 100%; display: block;}
.special-sale-card-first .product-content{border-top-left-radius: 20px;border-bottom-left-radius: 20px;}
.special-sale-card-first .imgs-slider{border-top-right-radius: 20px;border-bottom-right-radius: 20px;}
.special-sale-card-second .product-content{border-top-right-radius: 20px;border-bottom-right-radius: 20px;}
.special-sale-card-second .imgs-slider{border-top-left-radius: 20px;border-bottom-left-radius: 20px;}
.imgs-slider .swiper-pc{display: block;}
.imgs-slider .swiper-mo{display: none;}

/* 落地页商品卡片布局 */
.products {display: flex; gap:20px;justify-content: space-between;flex-wrap: wrap; width: 90%; margin: 0 auto; }
.product-card {background-color: #fff;border: 1px solid #ddd;border-radius: 5px;width: 30%;/*width:380px;*/padding: 20px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);position: relative;text-align: left;}

/* 落地页折扣标签 */
.discount-badge {position: absolute;top: 5px;left: 5px;color: #fff;width: 100px;height: 100px;font-weight: 600;font-size: 1.2rem;background-image: url('product_item_bg.png'); background-position: center center;background-repeat: no-repeat;background-size: cover;padding-top: 22px;text-align: center; }

/* 落地页商品图片 */
.product-card img {display:block; max-width: 100%;height: auto;margin:0 auto; margin-bottom: 20px;min-width:240px;min-height:240px;}

/* 落地页商品描述 */
.product-info {margin-bottom: 10px;}
.product-info h3 {font-size: 1.2rem;color: #333;margin-bottom: 10px;height: 55px; overflow: hidden;}
.product-info .price {font-size: 1.5rem;color: #871525;font-weight: bold;margin: 15px 10px 15px 0px;}
.product-info .old-price {font-size: 1rem;color: #888;text-decoration: line-through; margin-left: 10px;}
.product-info .promo-info {font-size: 0.9rem;color: #ff8c00;font-weight: bold;margin-bottom: 5px;}
.product-info .product-blank-area {display:block; height:46px;}
.product-info .prodduct-selects {width: 100%; padding: 10px 10px; border:1px solid #191919;color: #191919;}
.product-info .prodduct-selects .prodduct-selects-option {color: #871525; font-size: 14px;}
.product-info .prodduct-selects .prodduct-selects-option:hover {cursor:pointer;color: #fff;background-color: #871525; font-size: 14px;}
.product-info .monthly-price {font-size: 0.9rem;color: #555;margin-bottom: 15px;}
.product-info label {color: #871525;padding: 0 3px;/* border: 1px #333 solid; */margin: 2px 3px;font-weight: 400;}

/* 落地页按钮组 */
.buttons {display: flex;gap: 10px;}
.buttons button {flex: 1;padding: 10px;border: 2px solid #871525;color: #871525;font-weight: bold;background-color: #fff;cursor: pointer;border-radius: 3px;transition: all 0.3s ease;}
.buttons button:hover {background-color: #871525;color: #fff;}
.buttons button.buy-now {background-color: #871525;color: #fff;}

body .h1, body .h2, body .h3, body .h4, body .h6, body h1, body h2, body h3, body h4, body h6 {color: #ffffff; }
.sf__pcard-name, .text-color-subtext, .text-color-subtext p{color:#ffffff;}
.sec-custome-h2, p.sec-custome-p{ text-align: center; }

/*special gift*/
.surprise-gift-section {display: block; width: 100%; height: 500px; margin: 20px 0px; background-image:url('surprise-bg.jpg'); padding: 80px 80px;/* 背景图垂直、水平均居中 */background-position: center center;/* 背景图不平铺 */background-repeat: no-repeat;/* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 background-attachment: fixed;*//* 让背景图基于容器大小伸缩 */background-size: cover;}
.surprise-gift-section .suprise-gift-h1 {margin-top: 20px;display: block;width: 100%;font-weight: 800;font-size: 50px;}
.surprise-gift-section .suprise-gift-p {    margin-top: 20px;  font-size: 22px;}
.surprise-gift-section .join-it-btn { border:2px solid #fff;background-color: transparent;font-size: 22px; padding: 20px 160px; color: #fff; border-radius: 50px; margin: 40px 0 0 0; }
.surprise-gift-section .join-it-btn:hover{cursor: pointer; background-color: #871525; border:none;}
.surprise-gift-section.surprise-gift-pc {display: block;}
.surprise-gift-section.surprise-gift-mo {display: none;}

.faq-area {display: block; width: 70%; padding: 20px 0  50px 0; margin: 0 auto;}
.faq-area .faq-item {list-style-type: none; padding: 10px; margin: 0;  border-bottom:1px solid #666; }
.faq-area .faq-item.first{border-top:1px solid #666;}
.faq-area .faq-item .faq-title {font-size: 16px; margin: 5px; color:#e5e7eb;}
.faq-area .faq-item .faq-title:hover{cursor: pointer;}
.faq-area .faq-item .faq-content {display:none; font-size: 13px; padding: 5px; margin: 8px 0;color:#c5c9d1;}
.faq-area .faq-item .faq-content.active{display: block;}

/* 响应式调整：手机端适配 */
@media (max-width: 768px) {
  .container-fluid { padding-left: 1rem;padding-right: 1rem; }
  .product-display-section {padding-top: 0;}
  .product-display-section .product-section {padding: 0;}
  .banner-mobile-image { display: block; }
  .banner-desktop-image { display: none; }

  .header-banner { max-height: 500px; /* 降低Banner高度 */ }
  .header-banner .banner { width: 90%; /* 增加宽度适配小屏幕 */  padding: 0 20px; }
  .banner-content { padding: 0; }
  .banner-title { font-size: 1.5rem; }
  .banner-subtitle { font-size: 2.5rem; }
  .banner-text { font-size: 1rem; }

  .banner-dates .time-countdown-title {font-size: 16px;margin-top: 15px; margin-bottom: 20px;}
  .time-countdown-day span,.time-countdown-hour span,.time-countdown-min span,.time-countdown-sec span {font-size: 18px;padding: 5px;}

  .card-section{padding: 0px; gap: 5px;}
  .card a{padding: 0px; margin: 10px;}
  
  .navbar { padding: 0px; overflow-x: auto; /* 启用水平滚动 */ white-space: nowrap; /* 防止子元素换行 */ -webkit-overflow-scrolling: touch; /* 平滑滚动 */ }
  .navbar::-webkit-scrollbar { display: none; } /* 隐藏滚动条 */
  .navbar .navbar-wrap { display: flex; /* 使用 flexbox 布局 */ padding: 0; margin: 0; }
  .navbar-wrap a { font-size: 18px !important;  flex: 0 0 auto; /* 防止子元素缩小 */ padding: 5px 10px !important; /* 控制菜单项间距 */ line-height: 1.8rem !important;}
  .navbar::after { content: ""; position: absolute; top: 50%; right: 10px; width: 30px; height: 30px; /*background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));*/ pointer-events: none; /* 避免影响点击操作 */ transform: translateY(-50%); }
  
  /* 在小屏幕上导航菜单可能会垂直显示 */
  /*
  .navbar-wrap { display: block; }
  .navbar-wrap a { padding: 10px 0; display: block; font-size: 1.2rem; }
  */
  .sec-custome-h2 {display: flex; align-items: center;justify-content: center;}
  .sec-custome-h2 span{font-size: x-large;}
  .sec-custome-h2 .sec-custome-h2-img{width: 22%;}
  #premium-welders .sec-custome-h2 span{font-size: large;}
  #premium-welders .sec-custome-h2 .sec-custome-h2-img{width: 20%;}
  
  .products { gap: 10px; width:100%;}
  .product-card { width: 100%; /* 在手机上显示为单列 */ margin: 0 auto; margin-bottom: 20px; }
  .product-card .discount-badge { width: 80px; height: 80px; font-size: 0.9rem; }
  .product-card img{ min-width:0; min-height:0; }
  .product-info h3 { font-size: 1.1rem; height: 55px;overflow: hidden; }
  .product-info .product-blank-area {display:none;}
  .product-info .price { font-size: 1.3rem; }
  .buttons button { width: 80%; /* 按钮宽度全屏 */ padding: 10px; }

  .sf__ms-wrapper{display: block; margin: 0 auto; text-align: center;}
  .sf__ms-wrapper .sf-column{ margin: 0 auto; }
  
  .special-sale-card, .special-sale-card .product-content {flex-direction: column; width: 100%; border-radius: 3px;}
  .special-sale-card .product-content {padding: 20px;}
  .special-sale-card .product-img { width:100%; }
  .special-sale-card .product-image, .special-sale-card .imgs-slider {width: 100%; border-radius: 3px;}
  .special-sale-card .product-image {padding: 40px 10px 10px 10px;}
  .special-sale-card .product-details {width: 100%; padding: 0px;}
  .special-sale-card .product-details {width: 100%; padding: 0px 10px;}
  .special-sale-card .product-details .price {font-size: 1.3rem; margin:2px 0px 10px 10px}
  .special-sale-card .product-details .product-title {font-size: 16px;}
  .special-sale-card .product-details .product-options {margin: 10px 0;padding: 0px;}
  .special-sale-card .product-details .product-options .label-item{margin: 8px 0px; font-size:12px;}
  .special-sale-card .product-details .product-buttons {margin: 10px 0px 20px 0px;}
  .special-sale-card .product-details .product-buttons .buy-now, .special-sale-card .product-details .product-buttons .learn-more {
    padding: 10px 24px; font-size: 16px; border-radius:3px;
  }
  .special-sale-card .product-details .product-buttons .learn-more{font-size: 15px;}
  .special-sale-card-first .product-content {margin-bottom: 20px;}
  .special-sale-card-second{margin-top: 10px;}
  .imgs-slider .swiper-pc{display: none;}
  .imgs-slider .swiper-mo{display: block;}

  .surprise-gift-section {display: block; width: 100%; height: 300px; margin: 20px 0px; background-image:url('surprise-bg.jpg'); padding: 40px 30px;/* 背景图垂直、水平均居中 */background-position: center center;/* 背景图不平铺 */background-repeat: no-repeat;/* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 background-attachment: fixed;*//* 让背景图基于容器大小伸缩 */background-size: cover;}
  .surprise-gift-section .suprise-gift-h1 {display: block;width: 100%;font-weight: 500;font-size: 24px;}
  .surprise-gift-section .suprise-gift-p {margin-top: 10px;  font-size: 16px;}
  .surprise-gift-section .join-it-btn { border:2px solid #fff;background-color: transparent;font-size: 22px; padding: 5px 56px; color: #fff; border-radius: 15px; margin: 20px 0 0 0; }
  .surprise-gift-section .join-it-btn:hover{cursor: pointer; background-color: #871525; border:none;}
  .surprise-gift-section.surprise-gift-pc {display: none;}
  .surprise-gift-section.surprise-gift-mo {display: block;}

  .faq-area {width: 100%;}
}